<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                template="../templates/plantilla.xhtml">
    <ui:define name="head">Compra y Venta</ui:define>
    <ui:define name="content">

        <h1 class="title ui-widget-header ui-corner-all">Gestion de Pagos</h1>
        <div class="entry" style="line-height:200%">

            <p:ajaxStatus style="width:16px;height:16px;">
                <f:facet name="start">
                    <h:graphicImage value="../design/ajaxloading.gif" />
                </f:facet>

                <f:facet name="complete">
                    <h:outputText value="" />
                </f:facet>
            </p:ajaxStatus>

            <h:form id="productoForm">  

                <p:panel id="panel" header="Pagoo Nuvo">  

                    <h:panelGrid columns="3">  

                         <h:outputLabel for="cliente" value="Cliente: " />
                         <h:selectOneMenu id="cliente" value="#{pagoBean.pago.cliente}" converter="Cliente">
                            <f:selectItem itemLabel="Seleccionar uno" itemValue="" />
                            <f:selectItems value="#{clienteBean.clientes}" var="cliente"
                                           itemLabel="#{cliente.nombre}" itemValue="#{cliente}"/>
                        </h:selectOneMenu>
                        
                        <br/>
                        <h:outputLabel for="monto" value="Pago " /> 
                        <h:inputText id="monto" value="#{pagoBean.pago.monto}" label="Monto"></h:inputText>   

                        <br/> 
                             
                        <h:outputLabel for="fecha" value="Fecha " />
                        <p:calendar value="#{pagoBean.pago.fecha}" id="fecha" showOn="button" /> 
                        

                        <br/>

                       

                    </h:panelGrid>   

                    <h:commandButton id="btn" value="Guardar" action="#{pagoBean.crearPago()}"/>  
                </p:panel>  

            </h:form> 
        </div>

    </ui:define>
</ui:composition>

